<div id="light-box" *ngIf="list?.length>0">
  <div id="wrap" [style.width]="wrapWidth+'px'" #wrap>
     <div class="item" *ngFor="let slide of list">
      <img src="{{slide.imgUrl}}" (tap)="handleTap($event)" (panmove)="handlePanmove($event)" />
    </div>  

    <div class="grid-list" (swiperight)="handleSwipe($event)" *ngIf="showRecommend">
      <div class="grid-item" *ngFor="let item of grid" (click)="goToDetail(item)">
        <seed-img class="match-picture" [lazyLoadImg]="item.url" [defaultImg]="'long'" *ngIf="item.url"></seed-img>
        <h3 class="text-ellipsis"> {{item.titile}}</h3>
      </div>
    </div>
  </div>
  <div class="text toggle" *ngIf="index<list.length">
    <em class="total">{{list.length}}</em>/<span class="current">{{index+1}}</span>{{list[index].content}}
  </div>
</div>
